<template>
	<view>
		<view class="pay-result">
			<view class="success" v-if="status == true">
				<view class="msg">付款成功</view>
				<view class="btns">
					<navigator class="btn" url="/pages/buy/list" open-type="redirect">查看订单</navigator>
					<navigator class="btn" url="/pages/tabBar/mall/index" open-type="switchTab">继续逛</navigator>
				</view>
			</view>
			<view class="error" v-if="status != true">
				<view class="msg">付款失败</view>
				<view class="tips">
					<view class="p">请在 <text class="time">1小时</text> 内完成付款</view>
					<view class="p">否则订单将会被系统取消</view>
				</view>
				<view class="btns">
					<!-- <navigator class="btn" url="/pages/ucenter/order/order" open-type="redirect">查看订单</navigator> -->
					<button @click='redirectToOrderDetail'>查看订单</button>
				</view>
				<button class="btn" @click='repay' :loading="loading">重新付款</button>
			</view>
		</view>
	</view>
</template>

<script>
	import {
		payOrder
	} from '@/api/buy/order';
	export default {
		data() {
			return {
				status: false,
				orderId: "",
				prodiver: "",
				loading: false
			}
		},
		onLoad: function(e) {
			this.status = e.statusId
			this.orderId = e.orderId;
			// #ifdef APP-PLUS
			uni.getProvider({
				service: "payment",
				success: (e) => {
					console.log("payment success", e);
					e.provider.map((value) => {
						switch (value) {
							case 'alipay':
								return {
									name: '支付宝',
									id: value,
									loading: false,
									className: "uni-icon uni-icon-alipay color-text-info",
									checked: false,
								}
							case 'wxpay':
								return {
									name: '微信',
									id: value,
									loading: false,
									className: "uni-icon uni-icon-weixinzhifu color-text-green",
									checked: false,
								}
						}
					})
				},
				fail: (e) => {
					console.log("获取登录通道失败：", e);
				}
			});
			// #endif
		},
		onUnload: function() {
			this.loading = false;
		},
		methods: {
			// 返回订单详情页
			redirectToOrderDetail() {
				uni.redirectTo({
					url: '/pay/buy/orderDetail?id=' + this.orderId
				})
			},
			// 重新付款
			repay() {
				this.loading = true;
				payOrder(this.orderId).then(response => {
					console.log("得到订单信息", response);
					if (response.status !== 200 || res.rel == false) {
						console.log("获得订单信息失败", orderInfo);
						uni.showModal({
							content: "获得订单信息失败",
							showCancel: false
						})
						this.status = false;
						return;
					}


					var order = JSON.parse(response.data);
					if (data.resCode != 'SUCCESS') {
						uni.showModal({
							content: "获得订单信息失败",
							showCancel: false
						})
						this.status = false;
						return;
					} else {
						uni.requestPayment({
							provider: this.provider,
							orderInfo: data.payParams,
							success: (e) => {
								console.log("success", e);
								uni.showToast({
									title: "感谢您的购买，您的购买是我们坚持的动力之源!"
								})
								this.status = true;
							},
							fail: (e) => {
								this.status = false;
							},
							complete: () => {
								this.loading = false;
							}
						})
					}
				});
			}
		},
		// 原生的分享功能
		onShareAppMessage: function() {
			return {
				title: 'xbyjShop',
				desc: '食色男女',
				path: '/pages/pay/pay'
			}
		}

	}
</script>

<style>
	.pay-result {
		background: #fff;
	}

	.pay-result .msg {
		text-align: center;
		margin: 100upx auto;
		color: #2bab25;
		font-size: 36upx;
	}

	.pay-result .btns {
		display: flex;
		align-items: center;
		justify-content: center;
	}

	.pay-result .btn {
		text-align: center;
		height: 80upx;
		margin: 0 20upx;
		width: 200upx;
		line-height: 78upx;
		border: 1px solid #868686;
		color: #000000;
		border-radius: 5upx;
	}

	.pay-result .error .msg {
		color: #b4282d;
		margin-bottom: 60upx;
	}

	.pay-result .error .tips {
		color: #7f7f7f;
		margin-bottom: 70upx;
	}

	.pay-result .error .tips .p {
		font-size: 24upx;
		line-height: 42upx;
		text-align: center;
	}

	.pay-result .error .tips .p {
		line-height: 42upx;
		text-align: center;
	}
</style>
